<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>新增套餐包</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link href="css/layui.css" rel="stylesheet">
</head>
<body>
  <div style="width:80%;margin-top: 20px;">
    <form class="layui-form layui-form-pane1" lay-filter="package">
      <div class="layui-form-item">
        <label class="layui-form-label">套餐名称</label>
        <div class="layui-input-block">
          <input type="text" name="name" required lay-verify="required|name" lay-reqText="套餐名称不能为空" placeholder="请输入套餐名称" class="layui-input" >
        </div>
      </div>
      <div class="layui-form-item">
        <label class="layui-form-label">使用月数</label>
        <div class="layui-input-block">
          <input type="number" name="monthNumber" required lay-verify="required|number" min="1" value="12" lay-reqText="使用月数不能为空" class="layui-input" >
        </div>
      </div>
      <div class="layui-form-item">
        <label class="layui-form-label">赠送月数</label>
        <div class="layui-input-block">
          <input type="number" name="giveMonth" required lay-verify="required|number" min="0" value="0" lay-reqText="赠送月数不能为空" class="layui-input" >
        </div>
      </div>
      <div class="layui-form-item">
        <label class="layui-form-label">原价</label>
        <div class="layui-input-block">
          <input type="number" name="originalPrice" required lay-verify="required|number" min="1" lay-reqText="原价不能为空" class="layui-input" >
        </div>
      </div>
      <div class="layui-form-item">
        <label class="layui-form-label">实际价格</label>
        <div class="layui-input-block">
          <input type="number" name="price" required lay-verify="required|number" min="0" lay-reqText="实际价格不能为空"  class="layui-input" >
        </div>
      </div>
      <div class="layui-form-item">
        <div class="layui-input-block">
          <button class="layui-btn" id="btnSubmit">保存</button>
        </div>
      </div>
    </form>
  </div>
<script src="js/layui.js"></script>
<script type="module">
  import setMeal from './js/set-meal.js'

  layui.use(['form','layer'], function(){
    var $ = layui.$;
    var form = layui.form;
    var layer = layui.layer;

    form.verify({
      name:[/(.+){4,20}$/, '套餐名称必须4到20位'],
    });

    $('#btnSubmit').on('click', function(){
      form.submit('package', function(data){
        if(data.field.monthNumber < 1){
          layer.msg("使用月数大于0",{icon:5})
          return;
        }
        if(data.field.giveMonth < 0){
          layer.msg("赠送月数大于等于0",{icon:5})
          return;
        }
        if(data.field.originalPrice < 1){
          layer.msg("原价大于0",{icon:5})
          return;
        }
        if(data.field.price < 1){
          layer.msg("实际价格大于0",{icon:5})
          return;
        }
        
        setMeal.addRechargePackage($,data.field,function(rspData){
          if(rspData.code !=1){
            layer.msg("添加失败！",{icon:5});
          } else {
            layer.msg("保存成功");
            setTimeout(() => {
              var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
              parent.layer.close(index); //再执行关闭 
              parent.location.reload(); // 刷新页面
            }, 500);
          }
        });
      });

      return false;
    });
  });
</script>
</body>
</html>